import 'package:dio/dio.dart';
import 'package:flutter/material.dart';

class PaddingRoute extends StatelessWidget {
  const PaddingRoute({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('容器'),
      ),
      body: Column(
        children: [
          const Text('这是一个装饰器按钮'),
          DecoratedBox(
            decoration: BoxDecoration(
              boxShadow: const [
                BoxShadow(
                    color: Colors.black54,
                    offset: Offset(2.0, 2.0),
                    blurRadius: 4.0)
              ],
              gradient:
                  LinearGradient(colors: [Colors.red, Colors.orange.shade700]),
              borderRadius: BorderRadius.circular(3.0), //3像素圆角
            ),
            child: const Padding(
              padding: EdgeInsets.symmetric(vertical: 10, horizontal: 50),
              child: Text(
                'login',
                style: TextStyle(color: Colors.white),
              ),
            ),
          ),
          const Padding(
            padding: EdgeInsets.only(top: 20),
            child: Text('下满是一个容器组件卡片'),
          ),
          Container(
            margin: const EdgeInsets.only(top: 20, left: 40),
            width: 100,
            height: 100,
            decoration: BoxDecoration(
              gradient:
                  const LinearGradient(colors: [Colors.yellow, Colors.orange]),
              boxShadow: const [
                BoxShadow(
                    color: Colors.black54,
                    offset: Offset(2.0, 2.0),
                    blurRadius: 4.0)
              ],
              borderRadius: BorderRadius.circular(8),
            ),
            transform: Matrix4.rotationZ(.2), //卡片倾斜变换
            alignment: Alignment.center,
            child: const Text(
              '5.20',
              style: TextStyle(color: Colors.white, fontSize: 40.0),
            ),
          ),
          const Padding(
            padding: EdgeInsets.only(top: 40),
            child: Text('Padding和Margin'),
          ),
          Container(
            margin: const EdgeInsets.all(20.0), //容器外补白
            color: Colors.orange,
            child: const Text("Hello world!"),
          ),
          Container(
            padding: const EdgeInsets.all(20.0), //容器内补白
            color: Colors.orange,
            child: const Text("Hello world!"),
          ),
        ],
      ),
    );
  }
}

//页面骨架
class ScaffoldRoute extends StatefulWidget {
  const ScaffoldRoute({Key? key}) : super(key: key);

  @override
  State<ScaffoldRoute> createState() => _ScaffoldRouteState();
}

class _ScaffoldRouteState extends State<ScaffoldRoute> {
  int _selectedIndex = 1;
  List<String> stringArr = ['首页', '历史', '学校'];

  void _onItemTapped(int index) {
    setState(() {
      _selectedIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('页面骨架'),
        leading: Builder(
          builder: (context) {
            return IconButton(
                onPressed: () {
                  // 打开抽屉菜单
                  Scaffold.of(context).openDrawer();
                  print('打开侧边栏');
                },
                icon: const Icon(Icons.dashboard, color: Colors.white));
          },
        ),
        actions: [
          IconButton(
              onPressed: () {},
              icon: const Icon(Icons.share, color: Colors.white))
        ],
      ),
      drawer: const MyDrawer(),
      body: Center(
        child: Text(
          stringArr[_selectedIndex],
          style: const TextStyle(fontSize: 40, color: Colors.grey),
        ),
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: const [
          BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Home'),
          BottomNavigationBarItem(
              icon: Icon(Icons.business), label: 'Business'),
          BottomNavigationBarItem(icon: Icon(Icons.school), label: 'School'),
        ],
        currentIndex: _selectedIndex,
        fixedColor: Colors.blue,
        onTap: _onItemTapped,
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {},
        child: const Icon(Icons.add),
      ),
    );
  }
}

class MyDrawer extends StatelessWidget {
  const MyDrawer({
    Key? key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Drawer(
      child: MediaQuery.removePadding(
          context: context,
          removeTop: true,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              const Padding(
                padding: EdgeInsets.only(top: 38.0),
                child: Row(
                  children: <Widget>[
                    Padding(
                      padding: EdgeInsets.symmetric(horizontal: 16.0),
                      child: ClipOval(
                          child: Image(
                        image: AssetImage('images/touxiang.png'),
                        width: 80,
                      )),
                    ),
                    Text(
                      "Wendux",
                      style: TextStyle(fontWeight: FontWeight.bold),
                    )
                  ],
                ),
              ),
              Expanded(
                child: ListView(
                  children: const [
                    ListTile(
                      leading: Icon(Icons.add),
                      title: Text('Add account'),
                    ),
                    ListTile(
                      leading: Icon(Icons.settings),
                      title: Text('Manage accounts'),
                    ),
                  ],
                ),
              )
            ],
          )),
    );
  }
}

//网路请求简单用法
class FutureBuilderRoute extends StatefulWidget {
  const FutureBuilderRoute({Key? key}) : super(key: key);

  @override
  State<FutureBuilderRoute> createState() => _FutureBuilderRouteState();
}

class _FutureBuilderRouteState extends State<FutureBuilderRoute> {
  final Dio _dio = Dio();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('网路请求'),
      ),
      body: Container(
        alignment: Alignment.center,
        child: FutureBuilder(
          future: _dio.get("https://api.github.com/orgs/flutterchina/repos"),
          builder: (BuildContext context, AsyncSnapshot snapshot) {
            //请求完成
            if (snapshot.connectionState == ConnectionState.done) {
              Response response = snapshot.data;
              //发生错误
              if (snapshot.hasError) {
                return Text(snapshot.error.toString());
              }
              //请求成功，通过项目信息构建用于显示项目名称的ListView
              return ListView(
                children: response.data
                    .map<Widget>((e) => ListTile(title: Text(e["full_name"])))
                    .toList(),
              );
            }
            //请求未完成时弹出loading
            return const CircularProgressIndicator();
          },
        ),
      ),
    );
  }
}
